<!--
 * @author luguoxiang
 * @date 2022/9/17
 * 开源项目：https://gitee.com/lgx1992/lg-soar 求star！请给我star！请帮我点个star！
-->
<template>
  <edit-container ref="containerRef" header="分配功能权限" width="1200px" @confirm="submit">
    <div style="width: 100%; --lg-tree-indent: 2em">
      <menu-select v-model="joinIds" />
    </div>
  </edit-container>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { EditContainer } from '@/components';
import api from './api';
import MenuSelect from '@/pages/system/auth/menu/MenuSelect/index.vue';

const containerRef = ref();
const joinIds = ref([]);
const mainId = ref();
const loading = ref(false);

function submit() {
  api
    .setMenuIds({
      mainId: mainId.value,
      joinIds: joinIds.value,
    })
    .then(() => {
      containerRef.value.close();
    })
    .finally(() => {
      loading.value = false;
    });
  loading.value = true;
}

defineExpose({
  open(id) {
    mainId.value = id;

    api.getMenuIds(id).then((res) => {
      joinIds.value = res;
    });

    containerRef.value.open();
  },
});
</script>
